<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8" />
  <title>汉心码下载</title>
  <style>
    .container {
      overflow: scroll;
    }

    body {


      background-image: linear-gradient(to right, #4cbf30 -30%, #0f9d58);


      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      height: 100vh;
      margin: 0;
    }

    h1 {
      text-align: center;
      font-size: 5em;
      margin: 0.5em;
      color: #ffffff;
      font-weight: 400;
      letter-spacing: 15px;
      /* 设置字间距为2px */
    }

    h2 {
      font-size: 1.2em;
      color: #ffffff;
      /* 设置超链接颜色为蓝色 */
      margin: 0.5em;
      font-weight: 400;
      /* 设置字体为细体 */
    }

    h4 {

      font-weight: 400;
      /* 设置字体为细体 */
    }

    .links {
      color: white;
    }

    .links2 {
      color: white;

      display: flex;
      gap: 30px;
      /* 调整间距大小 */
    }

    .changgui {
      color: white;
    }

    .changgui2 {
      color: rgba(255, 255, 255, 0.5)
    }


    a {
      text-decoration: none;
      /* 去掉超链接下划线 */
      color: #ffffff;
      /* 设置超链接颜色为蓝色 */
      /* margin: 0 0.5em; */
      /* 添加超链接之间的间距 */




    }

    /* 媒体查询，应用于屏幕设备且屏幕宽度大于1200像素 */
    @media screen and (min-width: 1200px) {
      /* 在屏幕宽度不小于1200像素时应用的样式规则 */

      .links {
        display: flex;
        flex-wrap: wrap;
      }

      .link {
        flex: 1 0 auto;
      }

      .links2 {
        display: flex;
        flex-wrap: wrap;
      }

      .link2 {
        flex: 1 0 auto;
      }

      details {
        cursor: pointer;
        font-size: 20px;
      }




    }

    /* 媒体查询，手机端效果 */
    @media screen and (max-width: 1200px) {
      .links {
        display: block;
        font-size: 38px;
      }

      .link {
        margin-bottom: 10px;
        font-size: 38px;
      }

      h1 {
        font-size: 128px;
      }


      .links2 {
        display: block;
        font-size: 38px;
      }

      .link2 {
        margin-bottom: 10px;
      }

      h1 {
        font-size: 128px;
      }

      .changgui {
        color: white;
        font-size: 28px;
      }

      .changgui2 {
        color: rgba(255, 255, 255, 0.5);
        font-size: 32px;
      }

      .changgui2 {
        max-width: 800px;
        width: 500px;
      }

      details {
   
        font-size: 55px;
        margin-bottom: 20px;
        padding: 0;
      }

      a {
        font-size: 55px;



      }

    }
  </style>
</head>

<body>
  <h1>汉心双拼手机端下载</h1>
  <div class="changgui2">
    建议【手机端】下载码表导入手心输入法中使用，<br />
    苹果用百度五笔输入法导入码表使用，<br />
    或苹果用仓输入法平台，安卓用同文平台导入汉心电脑版小狼毫部署包即可使用。
  </div>

  <br />
  <div class="links2">
  






    <details>
      <summary><a href="http://yaoxiazai.ysepan.com" target="_blank">网盘内下载</a></summary>


    </details>


    <details>
      <summary><a href="./bei4yong4xia4zai3.html" target="_blank">备用地址</a></summary>


    </details>







  </div>

  <div class="changgui2"><br/>
    汉心码表在网盘内文件夹路径提示<br/>
    <hr>
    ---------↓🧡双拼汉心码↓---------<br/>
 

    🧡双拼辅助码-汉心码-【码表】<br/>
    A.📜码表
D.📱手机版挂码方法
<br/>
<a href="https://hanxinma.gitlab.io/" style="display: flex; align-items: center; justify-content: center; margin: 0 auto;" >回首页</a> 
    <hr>
  </div>

  
  <div class="changgui2"><br/>
    小狼毫部署包在网盘内文件夹路径提示<br/>

    <hr>
    🧡双拼音形-【汉心输入法】<br/>
    A,💻【汉心小狼毫版】<br/>
    C,📱手机版-这里有安装教程
  
    
  
    <hr>
  </div>
</body>
<script>
  // window.onload = function () {
  //   const h2Elements = document.querySelectorAll('h2');
  //   h2Elements.forEach((element, index) => {
  //     setTimeout(() => {
  //       breathe(element);
  //     }, index * 500); 
  //   });
  // }

  // function breathe(element) {
  //   let opacity = 1;
  //   let direction = -0.05;

  //   setInterval(() => {
  //     opacity += direction;

  //     if (opacity <= 0.1 || opacity >= 1) {
  //       direction = -direction;
  //     }

  //     element.style.opacity = opacity;
  //   }, 100);
  // }


  window.onload = function () {
    const h2Elements = document.querySelectorAll('h2');

    for (let i = 0; i < h2Elements.length; i++) {
      setTimeout(breathe.bind(null, h2Elements[i]), i * 500);
    }

    function breathe(element) {
      let opacity = 1;
      let direction = -0.05;

      setInterval(() => {
        opacity += direction;

        if (opacity <= 0.1 || opacity >= 1) {
          direction = -direction;
        }

        element.style.opacity = opacity;
      }, 100);
    }
  }

  // window.onload = function () {
  //   const h2Elements = document.querySelectorAll('h4');

  //   for (let i = 0; i < h2Elements.length; i++) {
  //     setTimeout(breathe.bind(null, h2Elements[i]), i * 500);
  //   }

  //   function breathe(element) {
  //     let opacity = 1;
  //     let direction = -0.05;

  //     setInterval(() => {
  //       opacity += direction;

  //       if (opacity <= 0.1 || opacity >= 1) {
  //         direction = -direction;
  //       }

  //       element.style.opacity = opacity;
  //     }, 100);
  //   }
  // }



  window.onload = function () {
    const h2Elements = document.querySelectorAll('summary');

    for (let i = 0; i < h2Elements.length; i++) {
      setTimeout(breathe.bind(null, h2Elements[i]), i * 500);
    }

    function breathe(element) {
      let opacity = 1;
      let direction = -0.05;

      setInterval(() => {
        opacity += direction;

        if (opacity <= 0.1 || opacity >= 1) {
          direction = -direction;
        }

        element.style.opacity = opacity;
      }, 100);
    }
  }




  document.addEventListener('click', function (e) {
    if (e.target.tagName === 'SUMMARY') {
      var details = e.target.parentNode;
      var allDetails = document.querySelectorAll('details');
      Array.prototype.forEach.call(allDetails, function (detail) {
        if (detail !== details) {
          detail.removeAttribute('open');
        }
      });
    }
  });
</script>

</html>